<!doctype html>
<html lang="en">

	<head>
		<meta charset="UTF-8" />
		<title>Document</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="css/mui.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">用户注册</h1>
		</header>
		<div class="mui-content">
			<form class="mui-input-group">
				<div class="mui-input-row">
					<label>用户名</label>
					<input type="text" id="username" class="mui-input-clear" placeholder="请输入用户名">
				</div>
				<div class="mui-input-row">
					<label>昵称</label>
					<input type="text" id="nickname" class="mui-input-clear" placeholder="请输入用户名">
				</div>
				<div class="mui-input-row">
					<label>密码</label>
					<input type="password" id="pwd" class="mui-input-password" placeholder="请输入密码">
				</div>
				<div class="mui-input-row">
					<label>确认密码</label>
					<input type="password" id="repwd" class="mui-input-password" placeholder="请输入密码">
				</div>

				<div class="mui-input-row mui-radio mui-left">
					<label>我是爸爸</label>
					<input name="gender" type="radio" value="2">
				</div>
				<div class="mui-input-row mui-radio mui-left">
					<label>我是妈妈</label>
					<input name="gender" type="radio" checked value="1">
				</div>
				<div class="mui-button-row">
					<button type="button" class="mui-btn mui-btn-primary" id="reg_btn">确认眼神</button>
					<button type="button" class="mui-btn mui-btn-danger">取消</button>
				</div>
			</form>
		</div>
		<script src="js/mui.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/md5.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init();
			document.getElementById('reg_btn').addEventListener('tap', function() {
				var username = document.getElementById("username").value;
				var nickname = document.getElementById("nickname").value;
				var pwd = document.getElementById("pwd").value;
				var repwd = document.getElementById("repwd").value;
				var gender_group = document.getElementsByName("gender");
				var gender = null;
				for(var i = 0; i < gender_group.length; i++) {
					if(gender_group[i].checked) {
						gender = gender_group[i].value;
					}
				}
				
				if(pwd != repwd){
					mui.toast('两次密码不一致');
					return
				}
				
				mui.post(window.serv + '/reg',{
						username : username,
						password : hex_md5(pwd),
						nickname : nickname,
						gender : gender
					},function(data){
						console.log(JSON.stringify(data));
						if (data.CODE == 0) {
							mui.toast(data.MSG);
							mui.back();
						}
					},'json'
				);
				
			})
		</script>
	</body>

</html>